<!--
  Generated template for the HeroObservablePage page.

  See http://ionicframework.com/docs/v2/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>hero.observable</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <h1>Tour of Heroes ({{mode}})</h1>
  <h3>Heroes:</h3>
  <ul>
    <li *ngFor="let hero of heroes">
      {{hero.name}}
    </li>
  </ul>
  New hero name:
  <input #newHeroName />
  <button (click)="addHero(newHeroName.value); newHeroName.value=''">
  Add Hero
</button>
  <div class="error" *ngIf="errorMessage">{{errorMessage}}</div>
</ion-content>
